

<div id="categoryLeftColumn">

	<c:forEach items="${categories}" var="category">
		<c:choose>
			<c:when test="${category.id == selectedCategory}">
				<div class="categoryButton" id="selectedCategory">
					<span class="categoryText">${category.name}</span>
				</div>
			</c:when>
			<c:otherwise>
				<a href="category?id=${category.id}" class="categoryButton"> <span class="categoryText">${category.name}</span></a>
			</c:otherwise>
		</c:choose>
	</c:forEach>
</div>

<div id="categoryRightColumn">
	<p id="categoryTitle">${products["0"].category.name}</p>

	<table id="productTable">

		<c:forEach items="${products}" var="product" varStatus="i">
			<tr class="${((i.index % 2) == 1) ? 'lightBlue':'white' }">
				<td><img src="${initParam.productImg}${product.name}.png" alt="product image"></td>
				<td>${product.name }<br> <span class="smallText">${product.description}</span>
				</td>
				<td>&euro; ${product.price} / item</td>
				<td>
					<form action="addToCart" method="post">
						<input type="hidden" name="productId" value="${product.id}"> <input type="submit"
							value="add to cart">
					</form>
				</td>
			</tr>
		</c:forEach>
	</table>
</div>

